import QtQuick 1.0
import "common"

Image {
    id:root
    width: 360
    height: 640
    source: "gfx/bg_section.png"
    property bool showSettings : true



    Column{
        id:top
        z:1
        StatusBar {}
        TopBar {
            onNext: showSettings ? topContain.x = -360 :  bottomContain.x = -360
            onBack: showSettings ? topContain.x = 0 :  bottomContain.x = 0
            onMenu: showSettings = !showSettings
        }
    }


    Item {
        id:fixContain
        anchors.top: top.bottom
        width: root.width * 2
        height:(root.height - 83) * 2


        Item {
            id:movableContain
            y:showSettings ? 0 : -(root.height - 83)
            width: parent.width
            height: parent.height

            Behavior on y {
                NumberAnimation {
                    easing.type: Easing.OutExpo
                    duration: 400

                }
            }


            Item {
                id: topContain
                width: parent.width
                height:root.height - 83

                Behavior on x {
                    NumberAnimation {
                        easing.type: Easing.OutExpo
                        duration: 400

                    }
                }

                MenuPage {
                    anchors.top: parent.top
                    anchors.left: parent.left
                    width: root.width
                    height: parent.height
                    onClicked: {
                        if ( get(index).path == "close")
                            ftpModel.close();
                        else{
                            menuLoader.source = Qt.resolvedUrl(get(index).path)
                            topContain.x = -root.width
                        }
                    }


                }
                Loader {
                    id:menuLoader
                    anchors.top: parent.top
                    anchors.right: parent.right
                    width: root.width
                    height: parent.height
                }
            }



            Item {
                id: bottomContain
                anchors.bottom: parent.bottom
                width: parent.width
                height: root.height - 83


                Behavior on x {
                    NumberAnimation {
                        easing.type: Easing.OutExpo
                        duration: 400

                    }
                }
                BrowserPage {
                    id:browser
                    anchors.top: parent.top
                    anchors.left: parent.left
                    width: root.width
                    height: parent.height

                }
                FtpPage {
                    id:ftp
                    destPath: browser.destPath
                    anchors.top: parent.top
                    anchors.right: parent.right
                    width: root.width
                    height: parent.height
                }
            }



        }














    }

}

//        Item {
//            id:fullContain
//            width:root.width * 2
//            height:root.height * 2
//            Behavior on y {
//                NumberAnimation {duration : 400 }
//            }





//            Item {
//                anchors.top: topBar.bottom
//                id: contain
//                width:root.width * 2
//                height:root.height - topBar.height
//                Behavior on x {
//                    NumberAnimation {duration : 400 }
//                }


//                BrowserPage {
//                    anchors.top: parent.top
//                    anchors.left: parent.left
//                    width: root.width
//                    height: parent.height

//                }

//                FtpPage {
//                    anchors.top: parent.top
//                    anchors.right: parent.right
//                    width: root.width
//                    height: parent.height
//                }

//            }

//        }

//        SettingsPage {
//            id:menuDialog
//            y:-640
//            onReturnPressed: {
//                menuDialog.y = -640
//                fullContain.y= 0
//            }

//            Behavior on y {
//                NumberAnimation {duration : 400 }
//            }


//        }



//}

